<template>
  <div class="feedback-page">
    <a-card :bordered="false">
      <!-- 表格顶部搜索部分 -->
      <c-table-search-form
        v-model="tableSearchForm"
        :datas="tableSearchFormData"
      >
        <template slot="allDeleteBtn">
          <a-popconfirm
           :title="`是否确认删除角色?`"
            v-if="selectedRowKeys.length > 0"
            ok-text="确定"
            cancel-text="取消"
            @confirm="handleDeleteAll"
          >
            <a-button icon="delete" type="danger">批量删除</a-button>
          </a-popconfirm>
        </template>
      </c-table-search-form>

      <!-- 表格部分 -->
      <c-table
        rowSelection
        showPagination
        :datas="tableData"
        :loading="loading"
        :columns="tableColumns"
        :paginationDatas="paginationDatas"
        @onPageSizeChange="onPageSizeChange"
        @onShowNumChange="onShowNumChange"
        @onSelectChange="onSelectChange"
      >
        <!-- 表格操作按钮 -->
        <template slot="handle" slot-scope="row">
          <a @click="handleAdd(row.tableRow, 'edit')"><a-icon type="edit" /> 编辑</a>
          <a-divider type="vertical" />
          <a-popconfirm
            ok-text="确定"
            cancel-text="取消"
            @confirm="handleDel()"
          >
            <p slot="title">
              是否确认要删除
            </p>
            <a type="link"><a-icon type="delete" /> 删除</a>
          </a-popconfirm>
          <a-divider type="vertical" />
          <a-popconfirm
            ok-text="确定"
            cancel-text="取消"
            @confirm="handleDel()"
          >
            <p slot="title">
              是否确认隐藏
            </p>
            <a type="link"><a-icon type="eye-invisible" />  隐藏</a>
          </a-popconfirm>
          <a-divider type="vertical" />
          <a type="link"><a-icon type="arrow-up" />顶置</a>
         
        </template>
      </c-table>
    </a-card>
  </div>
</template>

<script>
import { mapState } from "vuex";
import { getUserList } from "@/api/company/users";

export default {
  name: "Feedback",
  components: {},
  data() {
    return {
      tableSearchForm: {
        source: "1",
        compiler: "1",
        informationStatus: "1",
        informationTypes: "1",
        category: "1",
        searchKey:''
      },
      tableSearchFormData: [
        {
          label: "资讯来源",
          prop: "source",
          type: "select",
          typeData: [
            {
              label: "来源1",
              value: "1"
            },
            {
              label: "来源2",
              value: "2"
            },
            {
              label: "来源3",
              value: "3"
            }
          ]
        },
        {
          label: "编辑者",
          prop: "compiler",
          type: "select",
          typeData: [
            {
              label: "编辑者1",
              value: "1"
            },
            {
              label: "编辑者2",
              value: "2"
            },
            {
              label: "编辑者3",
              value: "3"
            }
          ]
        },
        {
          label: "资讯状态",
          prop: "informationStatus",
          type: "select",
          typeData: [
            {
              label: "资讯状态1",
              value: "1"
            },
            {
              label: "资讯状态2",
              value: "2"
            },
            {
              label: "资讯状态3",
              value: "3"
            }
          ]
        },
        {
          label: "资讯类型",
          prop: "informationTypes",
          type: "select",
          typeData: [
            {
              label: "资讯类型1",
              value: "1"
            },
            {
              label: "资讯类型2",
              value: "2"
            },
            {
              label: "资讯类型3",
              value: "3"
            }
          ]
        },
        {
          label: "所属分类",
          prop: "category",
          type: "select",
          typeData: [
            {
              label: "所属分类1",
              value: "1"
            },
            {
              label: "所属分类2",
              value: "2"
            },
            {
              label: "所属分类3",
              value: "3"
            }
          ]
        },
        {
          label: "",
          prop: "date",
          type: "date-picker"
        },
        {
          label: "标题关键词",
          prop: "searchKey",
          type: "search"
        },
        {
          prop: "export",
          type: "exportBtn"
        },
        {
          prop: "allDeleteBtn",
          type: "slot"
        }
      ],
      selectedRowKeys: [],
      tableColumns: [
        {
          title: "编号",
          dataIndex: "",
          align: "center"
        },
        {
          title: "资讯标题",
          dataIndex: "",
          align: "center"
        },
        {
          title: "资讯来源",
          dataIndex: "",
          align: "center"
        },
        {
          title: "资讯类型",
          dataIndex: "userId",
          align: "center"
        },
        {
          title: "所属分类",
          dataIndex: "",
          align: "center"
        },
        {
          title: "状态",
          dataIndex: "",
          align: "center"
        },
        {
          title: "是否顶置",
          dataIndex: "",
          align: "center"
        },
        {
          title: "创建时间",
          dataIndex: "",
          align: "center"
        },
        {
          title: "更新时间",
          dataIndex: "",
          align: "center"
        },
        {
          title: "编辑者",
          dataIndex: "",
          align: "center"
        },
        {
          title: "操作",
          dataIndex: "handle",
          scopedSlots: { customRender: "handle" },
          width: 280,
          align: "center"
        }
      ],
      tableData: [],
      paginationDatas: {
        pageSizeOptions: ["10", "20", "30", "40", "50","200","1000"],
        pageSize: 10,
        pageNum: 1,
        total: 0
      }
    };
  },
  computed: {
    ...mapState({})
  },
  created() {
    this.onPageOnlod();
  },
  mounted() {},
  methods: {
    handleDeleteAll() {
      this.deleteIdArr = [];
      this.selectedRows.map(item => {
        return this.deleteIdArr.push(item.id);
      });
      this.handleDel([...new Set(this.deleteIdArr)]);
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectedRows = selectedRows;
    },
    onChangeDataPicker() {},
    onPageOnlod() {
      this.loading = true;
      getUserList({
        auditState: this.companyStatus ? Number(this.companyStatus) : "",
        pageData: {
          ...{
            pageSize: this.paginationDatas.pageSize,
            pageNum: this.paginationDatas.pageNum
          }
        }
      })
        .then(res => {
          this.tableData = res.data.pageData;
          this.paginationDatas.total = res.data.total;
          this.loading = false;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    onShowNumChange(val) {
      this.paginationDatas.pageNum = val;
      this.onPageOnlod();
    },
    onPageSizeChange(val) {
      this.paginationDatas.pageSize = val;
      this.onPageOnlod();
    }
  }
};
</script>

<style lang="less" scoped>
</style>




